<template>
    <div>
        <div class="shop_box">
            <p class="back">
                <i class="van-icon van-icon-arrow-left" @click="$router.go(-1)" />
            </p>
            <div class="kanjia">
                <i class="van-icon van-icon-user-circle-o"></i>
                <p>我发现一件好货，来帮我砍到最低价吧~</p>
                <div class="shop">
                    <img
                        src="https://dcdn.it120.cc/2019/07/24/a30b67dd-61be-41bd-841c-7e3f8844e958.jpg"
                    />
                    <div>
                        <p>男式羊羔绒休闲外套</p>
                        <div>
                            <p>
                                低价
                                <span>￥100</span>
                            </p>
                            <p>原价￥231.95999999999998</p>
                        </div>
                    </div>
                </div>
                <p>
                    当前价
                    <span>211.63</span>
                    元，已坎
                    <span>20.33</span>
                    元
                </p>
                <div>
                    <p>以当前价格购买</p>
                    <!---->
                    <p>邀请好友砍价</p>
                </div>
                <div>
                    <div class="van-count-down">
                        <span class="item">598</span> :
                        <span class="item">21</span> :
                        <span class="item">30</span> :
                        <span class="item">43</span>
                    </div>
                </div>
                <p class="triangle"></p>
            </div>
            <p class="ji">1名好友帮砍</p>
            <ul id="kanjia_ul">
                <li>
                    <i class="van-icon van-icon-user-circle-o">
                        <!---->
                    </i>
                    <div>
                        <p></p>
                        <p>2019-04-14 15:09:45</p>
                    </div>
                    <p>
                        <i class="van-icon van-icon-edit">
                            <!---->
                        </i>砍掉20.33
                    </p>
                </li>
            </ul>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            shop: {},
        };
    },
    mounted() {
        // this.$API
    },
};
</script>

<style lang="scss">
.shop_box {
    font-size: 12px;
    width: 100%;
    height: 60vh;
    background: linear-gradient(to right top, #e7d9bf, #b7a47c);
    color: #fff;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    .back {
        width: 8vw;
        height: 8vw;
        border-radius: 50%;
        border: 0.4vw solid white;
        text-align: center;
        line-height: 9vw;
        position: fixed;
        left: 3vw;
        top: 2vh;
        z-index: 999;
        i {
            width: 6vw;
            height: 6vw;
            border-radius: 50%;
            background-color: white;
            color: black;
            display: inline-block;
            line-height: 6vw;
            text-align: center;
        }
    }
    .kanjia {
        color: #fff;
        text-rendering: auto;
        width: 100%;
        text-align: center;
        .van-icon-user-circle-o {
            font-size: 60px;
            margin-top: 3vh;
        }
        .shop {
            width: 86%;
            height: 18vh;
            display: flex;
            align-items: center;
            img {
                width: 30%;
                height: 90%;
            }
            .right {
                width: 65%;
                height: 90%;
                background-color: #f5eddd;
            }
        }
    }
}
</style>